<template>
    <div>
        <Modal :title="modalTitle" v-model="modalVisible" :mask-closable='false' :width="600" :styles="{top: '100px'}">
            <Form ref="form" :model="form" :label-width="70" :rules="formValidate">
                <FormItem label="兑换学时" prop="period">
                    <InputNumber v-model="form.period" style="width:450px" placeholder="请输入可兑换学时"/>
                </FormItem>
                <FormItem label="选择课程" prop="courseId">
                    <continuing-choose buttonText="选择课程" continueType="1" @on-change="handleSelectCourse" ref="course"></continuing-choose>
                </FormItem>
            </Form>
            <div slot="footer">
                <Button type="text" @click="cancelUser">取消</Button>
                <Button type="primary" :loading="submitLoading" @click="handelSubmit">提交</Button>
            </div>
        </Modal>
    </div>
</template>

<script>
    import {addNewContinueCourse, resetContinueCourse} from "@/api/bus";
    import continuingChoose from "../../../my-components/flyme/continuing-choose";

    export default {
        name: "continueCourseDrawer",
        components: {
            continuingChoose
        },
        data() {
            return {
                type: 0,
                errorPass: "",
                deptLoading: false,
                modalTitle: "",
                submitLoading: false,
                modalVisible: false,
                stuItemList: [],
                workItemList: [],
                form: {
                    id: '',
                    courseId: '',
                    certificateId: '',
                    period: 1
                },
                formValidate: {
                    courseId: [{required: true, message: "课程不能为空", trigger: "blur"}],
                    period: [{required: true, type: 'number', message: "可兑换学时不能为空", trigger: "blur"}]
                },
            }
        },
        methods: {
            showDrawer(params) {
                this.modalVisible = true;
                console.info(params)
                if (params.id) {
                    this.form.id = params.id
                    this.form.courseId = params.courseId
                    this.form.period = params.period
                    this.form.certificateId = params.certificateId
                    this.modalTitle = "编辑继续教育课程";
                    let course = {
                        courseTitle: params.courseTitle,
                        courseId: params.courseId
                    }
                    let courseIds = [course];
                    this.$refs.course.setSelectUser(courseIds);
                } else {
                    this.$refs.form.resetFields();
                    this.modalTitle = "新增继续教育课程";
                    this.form.certificateId = params.certificateId
                    this.form.period = ''
                    this.form.courseId = ''
                    this.form.id = ''
                }
            },
            handleSelectCourse(v){
                this.form.courseId = v[0].id;
                this.selectCourses = v;
                console.info(v)
            },
            cancelUser() {
                this.modalVisible = false;
            },
            handelSubmit() {
                this.$refs.form.validate(valid => {
                    if (valid) {
                        this.submitLoading = true;
                        addNewContinueCourse(this.form).then(res => {
                            this.submitLoading = false;
                            if (res.status === true) {
                                this.$Message.success("添加成功");
                                this.$parent.getDataList();
                                this.$parent.resetContinueCourse();
                                this.modalVisible = false;
                            }
                        });
                    }
                });
            }
        },
        mounted() {

        }
    }
</script>

<style>

</style>